import 'package:flutter/material.dart';
import 'package:kq_flutter_core_widget/utils/kq_screen_util.dart';
import 'package:kq_flutter_core_widget/widgets/button/kq_ink_well.dart';
import 'package:kq_flutter_pad_widgets/resources/kq_pad_theme_colors.dart';

///customBuilder: 每一行右侧自定义
///crossAxisAlignment: 时间轴的样式
///padding: 默认zero
///onTap: 点击 未选中
class KqCustomTimeLineFactory<T> {
  Widget build(
      {required List<T> data,
      required String Function(T object, int index) textBuilder,
      Widget Function(T object, int index)? timeBuilder,
      Widget Function(T object, int index)? subTimeBuilder,
      Color? circleColor,
      Color? unSelectedCircleColor,
      Color? circleBorderColor,
      Color? unSelectedCircleBorderColor,
      Color? lineColor,
      Color? selectedBgColor,
      Color? selectedFontColor,
      double? circleSize,
      double? circularLineSpacing,
      double? timeLineItemSize,
      double? fontSize,
      int? selectedIndex,
      EdgeInsetsGeometry padding = EdgeInsets.zero,
      CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
      void Function(T object, int index)? onTap}) {
    return KqCustomTimeLinePage(
      data: data,
      textBuilder: textBuilder,
      timeBuilder: timeBuilder,
      subTimeBuilder: subTimeBuilder,
      circleColor: circleColor,
      unSelectedCircleColor: unSelectedCircleColor,
      circleBorderColor: circleBorderColor,
      unSelectedCircleBorderColor: unSelectedCircleBorderColor,
      circleSize: circleSize,
      lineColor: lineColor,
      selectedBgColor: selectedBgColor,
      selectedFontColor: selectedFontColor,
      circularLineSpacing: circularLineSpacing,
      timeLineItemSize: timeLineItemSize,
      fontSize: fontSize,
      selectedIndex: selectedIndex,
      padding: padding,
      crossAxisAlignment: crossAxisAlignment,
      onTap: onTap,
    );
  }
}

class KqCustomTimeLinePage<T> extends StatefulWidget {
  final List<T> data;
  final Color? circleColor;
  final Color? unSelectedCircleColor;
  final Color? circleBorderColor;
  final Color? unSelectedCircleBorderColor;
  final Color? lineColor;
  final double? circleSize;
  final Color? selectedBgColor;
  final Color? selectedFontColor;
  final double? circularLineSpacing;
  final double? timeLineItemSize;
  final double? fontSize;
  final EdgeInsetsGeometry padding;
  final CrossAxisAlignment crossAxisAlignment;
  final int? selectedIndex;
  final void Function(T object, int index)? onTap;
  final String Function(T object, int index) textBuilder;
  final Widget Function(T object, int index)? timeBuilder;
  final Widget Function(T object, int index)? subTimeBuilder;
  final Widget? emptyView;

  const KqCustomTimeLinePage(
      {super.key,
      required this.data,
      required this.textBuilder,
      this.timeBuilder,
      this.subTimeBuilder,
      this.circleColor,
      this.unSelectedCircleColor,
      this.circleBorderColor,
      this.unSelectedCircleBorderColor,
      this.lineColor,
      this.selectedBgColor,
      this.selectedFontColor,
      this.circleSize,
      this.circularLineSpacing,
      this.timeLineItemSize,
      this.fontSize,
      this.padding = EdgeInsets.zero,
      this.selectedIndex,
      this.crossAxisAlignment = CrossAxisAlignment.center,
      this.emptyView,
      this.onTap});

  @override
  State<KqCustomTimeLinePage> createState() => _KqCustomTimeLinePageState();
}

class _KqCustomTimeLinePageState extends State<KqCustomTimeLinePage> {
  int? currentIndex;

  @override
  void initState() {
    super.initState();
    if (widget.selectedIndex != null) {
      currentIndex = widget.selectedIndex!;
    }
  }

  @override
  Widget build(BuildContext context) {
    List widgets = [];
    for (var i = 0; i < widget.data.length; i++) {
      widgets.add(
        _buildTimeLine(i),
      );
    }
    return widget.data.isEmpty
        ? widget.emptyView ?? Container()
        : SingleChildScrollView(
            padding: widget.padding,
            child: Column(
              crossAxisAlignment: widget.crossAxisAlignment,
              children: [...widgets],
            ),
          );
  }

  ///画线
  ///customWidget: 右侧的自定义
  ///circleColor: 圈的颜色
  _buildTimeLine(int index) {
    //圈上下的线 显隐处理
    bool top = index == 0 ? false : true;
    bool bottom = index + 1 == widget.data.length ? false : true;
    //当前的下方
    bool currentBottom = index == currentIndex;
    bool nextTop = index == (currentIndex ?? index) + 1;

    Widget? result;
    Color borderColor = currentIndex == index
        ? widget.circleBorderColor ?? const Color(0xff00388B)
        : widget.unSelectedCircleBorderColor ?? const Color(0xff006300);
    if (currentIndex != index) {
      result = SizedBox(
        width: widget.circleSize ?? 6.dm,
        height: widget.circleSize ?? 6.dm,
        // color: widget.circleColor ?? const Color(0xFF00388B),
      );
      // result = KqImage.assets(
      //   url: Images.commonIcWeixuanzhong,
      //   width: 6.dm,
      //   height: 6.dm,
      //   fit: BoxFit.cover,
      // );
    }
    Widget customWidget = Container(
        decoration: BoxDecoration(
            color: currentIndex != null && currentIndex == index
                ? widget.selectedBgColor ?? const Color(0xff00388B)
                : Colors.transparent,
            borderRadius: BorderRadius.all(Radius.circular(4.dm))),
        // height: 18.dm,
        alignment: Alignment.centerLeft,
        padding: EdgeInsets.symmetric(horizontal: 4.dm, vertical: 8.dm),
        child: Text(
          widget.textBuilder(widget.data[index], index),
          overflow: TextOverflow.ellipsis,
          maxLines: 1,
          style: TextStyle(
              fontSize: widget.fontSize ?? 7.dm,
              color: currentIndex != null && currentIndex == index
                  ? KqPadThemeColors.textWhite
                  : const Color(0xFF262626)),
        ));
    Widget timeWidget =
        widget.timeBuilder?.call(widget.data[index], index) ?? const SizedBox();
    Widget subTimeWidget =
        widget.subTimeBuilder?.call(widget.data[index], index) ??
            const SizedBox();
    return KqInkWell(
        onTap: widget.onTap != null
            ? () {
                setState(() {
                  currentIndex = index;
                });
                widget.onTap!.call(widget.data[index], index);
              }
            : null,
        child: SizedBox(
          height: widget.timeLineItemSize ?? 24.dm,
          child: Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Column(
                crossAxisAlignment: CrossAxisAlignment.end,
                children: [
                  Expanded(
                      child: top
                          ? _dashLine(Colors.transparent)
                          : const SizedBox()),
                  SizedBox(
                    height: index == 0 ? 0 : widget.circularLineSpacing ?? 4.dm,
                  ),
                  Opacity(
                    opacity: 0,
                    child: subTimeWidget,
                  ),
                  timeWidget,
                  subTimeWidget,
                  SizedBox(
                    height: widget.circularLineSpacing ?? 4.dm,
                  ),
                  Expanded(
                      child:
                          bottom ? _dashLine(Colors.transparent) : Container()),
                ],
              ),
              SizedBox(
                width: 5.dm,
              ),
              Column(
                children: [
                  Expanded(
                      child: top
                          ? (nextTop ? _dashLine(null) : _line(null))
                          : const SizedBox()),
                  SizedBox(
                    height: index == 0 ? 0 : widget.circularLineSpacing ?? 4.dm,
                  ),
                  Container(
                    decoration: BoxDecoration(
                        color: currentIndex != null && currentIndex == index
                            ? widget.circleColor ?? const Color(0xFF00388B)
                            : widget.unSelectedCircleColor ??
                                Colors.transparent,
                        border: Border.all(color: borderColor),
                        borderRadius: BorderRadius.all(Radius.circular(
                            widget.circleSize != null
                                ? (widget.circleSize! / 2)
                                : 3.dm))),
                    width: widget.circleSize ?? 6.dm,
                    height: widget.circleSize ?? 6.dm,
                    child: result,
                  ),
                  SizedBox(
                    height: widget.circularLineSpacing ?? 4.dm,
                  ),
                  Expanded(
                      child: bottom
                          ? (currentBottom ? _dashLine(null) : _line(null))
                          : Container()),
                ],
              ),
              SizedBox(width: 5.dm),
              Expanded(
                child: Column(
                  children: [
                    Expanded(
                        child: top
                            ? _dashLine(Colors.transparent)
                            : const SizedBox()),
                    SizedBox(
                      height:
                          index == 0 ? 0 : widget.circularLineSpacing ?? 3.dm,
                    ),
                    customWidget,
                    SizedBox(
                      height: widget.circularLineSpacing ?? 4.dm,
                    ),
                    Expanded(
                        child: bottom
                            ? _dashLine(Colors.transparent)
                            : Container()),
                  ],
                ),
              ),
            ],
          ),
        ));
  }

  _line(Color? lineColor) {
    //实线
    return Container(
      width: 1,
      color: widget.lineColor ?? const Color(0x3300388B),
    );
  }

//虚线
  _dashLine(Color? lineColor) {
    return CustomPaint(
      painter: VerticalDashedPainter(
          borderWidth: 1,
          borderColor: lineColor ?? widget.lineColor ?? const Color(0xff00388B),
          dashSpace: 1,
          dashWidth: 1),
      child: Container(),
    );
  }
}

class VerticalDashedPainter extends CustomPainter {
  final double borderWidth;
  final Color borderColor;
  final double dashSpace;
  final double dashWidth;

  VerticalDashedPainter(
      {required this.borderWidth,
      required this.borderColor,
      required this.dashSpace,
      required this.dashWidth});

  @override
  void paint(Canvas canvas, Size size) {
    final Paint paint = Paint()
      ..color = borderColor
      ..style = PaintingStyle.stroke
      ..strokeWidth = borderWidth;

    final dashPath = Path();
    var x =
        size.width > dashWidth ? (size.width - dashWidth) / 2.0 : size.width;

    double y = 0.0;
    while (y < size.height) {
      dashPath.moveTo(x, y > size.height ? size.height : y);

      dashPath.lineTo(
          x, (y + dashWidth) > size.height ? size.height : (y + dashWidth));
      y += dashWidth + dashSpace;
    }

    canvas.drawPath(dashPath, paint);
  }

  @override
  bool shouldRepaint(CustomPainter oldDelegate) {
    return false;
  }
}
